<!DOCTYPE html>
<html class="x-admin-sm">
    <head>
        <meta charset="UTF-8">
        <title>欢迎页面-X-admin2.2</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
        <link rel="stylesheet" href="./css/font.css">
<!--        <link rel="stylesheet" href="./css/layui.css">-->
        <link rel="stylesheet" href="./css/xadmin.css">
        <script src="./lib/layui/layui.js" charset="utf-8"></script>
        <script type="text/javascript" src="./js/xadmin.js"></script>
        <script type="text/javascript" src="./js/jquery.min.js"></script>
        <!--[if lt IE 9]>
          <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
          <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
        <![endif]-->
    </head>
    <body>
        <div class="x-nav">
          <span class="layui-breadcrumb">
            <a href="">首页</a>
            <a href="">演示</a>
            <a>
              <cite>导航元素</cite></a>
          </span>
          <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新">
            <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i></a>
        </div>
        <div class="layui-fluid">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-body ">
                            <form class="layui-form layui-col-space5">
                                <div class="layui-inline layui-show-xs-block">
                                    <input class="layui-input"  autocomplete="off" placeholder="开始日" name="start" id="start">
                                </div>
                                <div class="layui-inline layui-show-xs-block">
                                    <input class="layui-input"  autocomplete="off" placeholder="截止日" name="end" id="end">
                                </div>
                                <div class="layui-inline layui-show-xs-block">
                                    <input type="text" name="goodsName"  placeholder="物资名称" autocomplete="off" class="layui-input">
                                </div>
                                <div class="layui-inline layui-show-xs-block">
                                    <button class="layui-btn"  lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
                                </div>
                            </form>
                        </div>
                        <div class="layui-btn-group demoTable">
                            <button class="layui-btn layui-btn-danger" data-type="delMore"><i class="layui-icon"></i>批量删除</button>
                            <button class="layui-btn" onclick="xadmin.open('添加物资','capital-goods-add.html',600,400)"><i class="layui-icon"></i>添加</button>
                        </div>
                        <div class="layui-card-body ">
                            <table class="layui-table layui-form" id="layListId" lay-filter="layList">



                                <script type="text/html" id="barDemo">
                              <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                              <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
                                </script>

                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </body>
    <script>
      layui.use(['laydate','form','table'], function(){
        var laydate = layui.laydate;
        var form = layui.form;
        var table=layui.table;
        //执行一个laydate实例
        laydate.render({
          elem: '#start' //指定元素
        });
        //执行一个laydate实例
        laydate.render({
          elem: '#end' //指定元素
        });
        //  layer.alert(">>>>>>."+location.search);
          table.render({
              elem: '#layListId',
              id: 'layTableId',
              url: '/materiel/list'+location.search,
              title: '物资列表',
              cellMinWidth: 60,
               page: true //开启分页

              ,totalRow: true,//开启合计行
              cols: [
                  [{
                      type: 'checkbox',
                      fixed: 'left'
                  }, {
                      field: 'goodsNumber',
                      title: '物资编号',
                      fixed: 'left'
                  }, {
                      field: 'goodsName',
                      title: '物资名称',
                      minWidth: '100'
                  }, {
                      field: 'goodsPrice',
                      title: '物资价格',
                      minWidth: '40',
                      templet: function (d) {
                           return '￥'+d.goodsPrice;
                      },
                      offset: 'auto'
                  }, {
                      field: 'goodsBuyDate',
                      title: '物资购入时间',
                  }, {
                      field: 'goodsUseMonth',
                      title: '物资使用时长(单位：月)',

                  }, {
                      field: 'goodsBreakageRate',
                      title: '物资折损率',
                      templet: function (d) {
                          return d.goodsBreakageRate*100+'%';

                      },
                  }, {
                      title: '物资当前状态',
                      field: 'goodsType',
                      templet: function (d) {
                          if (d.goodsType === 1) return '空闲';
                          if (d.goodsType === 2) return '使用中';
                      },
                      offset: 'auto'
                  }, {
                      field:'goodsArea',
                      title: '物资所在区域态',
                      align: 'center',
                      // toolbar: '#barDemo1',
                  }, {
                      title: '操作',
                      minWidth: '150',
                      align: 'center',
                      toolbar: '#barDemo',
                  }
                  ]
              ]


          });

          table.on('checkbox(layList)', function(obj){
              console.log(obj)
          });
          //监听工具条,删除，编辑
          table.on('tool(layList)', function(obj){
              var data = obj.data;
                if(obj.event === 'del'){
                  layer.confirm('确定删除？', function(index){
                      $.ajax({
                          url:'/materiel/delete',
                          method:'post',
                          data:{goodsNumber:data.goodsNumber},
                          dataType:'JSON',
                          success:function(res){
                              if(res.code==200){
                                  layer.alert("删除成功", {
                                          icon: 6
                                      },
                                      function() {
                                          //关闭当前frame
                                          xadmin.close();
                                          // 可以对父窗口进行刷新
                                          xadmin.father_reload();
                                      });
                              }
                              else
                                  alert(res.msg);
                          },
                          error:function (data) {
                              alert("服务器忙碌！");
                          } });


                  });
              } else if(obj.event === 'edit') {
                    xadmin.open('编辑', './capital-goods-edit.html#/id='+data.goodsNumber, 800, 700);
                }

          });

          var $ = layui.$, active = {
              //批量删除
              delMore: function () { //获取选中数据
                  var checkStatus = table.checkStatus('layTableId')
                      , data = checkStatus.data;
                  if(checkStatus.data.length==0){
                      parent.layer.msg('请先选择要删除的数据行！', {icon: 2});
                      return ;
                  }
                  var nums = "";
                  for(var i=0;i<checkStatus.data.length;i++){
                      nums += checkStatus.data[i].goodsNumber+",";
                  }
                  layer.confirm('确定删除？', function(index) {
                      $.ajax({
                          url: '/materiel/deleteBatch',
                          method: 'post',
                          data: {nums: nums},
                          dataType: 'JSON',
                          success: function (res) {
                              if (res.code == 200) {
                                  layer.alert("删除成功", {
                                          icon: 6
                                      },
                                      function () {
                                          //关闭当前frame
                                          xadmin.close();
                                          // 可以对父窗口进行刷新
                                          xadmin.father_reload();
                                      });
                              } else
                                  alert(res.msg);
                          },
                          error: function (data) {
                              alert("服务器忙碌！");
                          }
                      })
                  });
              }
          };
          $('.demoTable .layui-btn').on('click', function(){
              var type = $(this).data('type');
              active[type] ? active[type].call(this) : '';
          });
      });
    </script>
</html>